<template lang="">
  <div class="product">
   <div class="match_brief">
    <h4><img v-lazy="getAssetsImages('basketball_title.png')" width="174" /></h4>
    <ul class="fix">
     <li><img v-lazy="getAssetsImages('basketball_NBA.png')" width="128" /><p><span>{{ $t('guoJ') }}</span> {{ $t('weiM') }} </p></li>
     <li><img v-lazy="getAssetsImages('basketball_CBA.png')" width="128" /><p><span>{{ $t('zhong') }}</span> {{ $t('zhong-0') }} </p></li>
     <li><img v-lazy="getAssetsImages('basketball_BJ.png')" width="128" /><p><span>{{ $t('riBe') }}</span> {{ $t('shiY-2') }} </p></li>
     <li><img v-lazy="getAssetsImages('basketball_KBL.png')" width="128" /><p><span>{{ $t('hanG') }}</span> {{ $t('shiH') }} </p></li>
     <li><img v-lazy="getAssetsImages('basketball_SBL.png')" width="128" /><p><span>{{ $t('chao-0') }}</span> {{ $t('shiT') }} </p></li>
     <li><img v-lazy="getAssetsImages('basketball_EL.png')" width="128" /><p><span>{{ $t('ouZh') }}</span> {{ $t('shiO') }} </p></li>
    </ul>
    <h4><img v-lazy="getAssetsImages('baseball_title.png')" width="174" /></h4>
    <ul class="fix">
     <li><img v-lazy="getAssetsImages('baseball_MLB.png')" width="128" /><p><span>{{ $t('meiG') }}</span> {{ $t('shiM-0') }} </p></li>
     <li><img v-lazy="getAssetsImages('baseball_NPB.png')" width="128" /><p><span>{{ $t('sheT') }}</span> {{ $t('shiG') }} </p></li>
     <li><img v-lazy="getAssetsImages('baseball_KBO.png')" width="128" /><p><span>{{ $t('hanG-0') }}</span> {{ $t('shiH-0') }} </p></li>
     <li><img v-lazy="getAssetsImages('baseball_CPBL.png')" width="128" /><p><span>{{ $t('zhong-1') }}</span> {{ $t('shiT-0') }} </p></li>
    </ul>
    <div class="ant-row">
     <div class="iceHockey">
      <h4 class="fix"><img v-lazy="getAssetsImages('IceHockey_title.png')" width="174" /></h4>
      <div class="ant-row">
       <img v-lazy="getAssetsImages('baseball_CPBL.png')" width="128" />
       <p><span>{{ $t('guoJ-0') }}</span> {{ $t('shiY-3') }} </p>
      </div>
     </div>
     <div class="americanFootball">
      <h4 class="fix"><img v-lazy="getAssetsImages('americanFootball_title.png')" width="174" /></h4>
      <div class="ant-row">
       <img v-lazy="getAssetsImages('americanFootball_NFL.png')" width="128" />
       <p><span>{{ $t('guoJ-1') }}</span> {{ $t('shiY-4') }} </p>
      </div>
     </div>
    </div>
    <h4 style="margin-top: 44px;"><img v-lazy="getAssetsImages('football_title.png')"  width="174" /></h4>
    <div class="product_bot fix">
     <img v-lazy="getAssetsImages('football_soccer.png')" />
     <p>{{ $t('geZh') }}</p>
    </div>
    <h4 style="margin-top: 44px;"><img v-lazy="getAssetsImages('tennis_title.png')" width="174" /></h4>
    <div class="product_bot fix">
     <img v-lazy="getAssetsImages('tennis_img.png')" />
     <p>{{ $t('zhuM') }}</p>
    </div>
   </div>
  </div>
 </template>
 <script setup lang="ts">
import { getAssetsImages } from '@/utils';
 </script>
 <style lang="less"></style>